import React, {
  Component,
  createRef,
  createContext,
  useRef,
  useState,
} from "react";
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
//  react 跨多级组件传递参数
const { Provider, Consumer } = createContext({});

const DemoA = (props:any) => {
   const {children} =props
   console.log(children)
   
  return (
    <>
   this is childer  children
   <div>--------------------</div>
   {children[0]}
   {children[1]()}
   {/* {  Object.prototype.toString.call(children)==='[object Function]'?children():children } */}
  
   </>
  );
};

class ReactDemo extends React.Component {
  state: any = {
    massage: "只是一个数据",
    list:[
        {id:'1',name:'znag fda shan ' , age :10,info:' this is info '},

        {id:'11',name:'znag fda shan 12312123' , age :110,info:' 11this is info '}
        ,
        {id:'133',name:'znag fda shan 44111' , age :1330,info:' 33333this is info '}
    ]
  };

   handleDelete =(id:any)=>{
    console.log(id)

    this.setState({
        list:this.state.list.filter((item:any)=>item.id !==id)
    })
  
  }

  render(): React.ReactNode {
    return (
      <>
       
        <div>嘻嘻嘻</div>
      <DemoA>
      
        {<div><p> wo yizhi zai cishi</p></div>}
        {()=>console.log(1111)}
      
      </DemoA>
      </>
    );
  }
}

export default ReactDemo;
